<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TOP10榜</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="../static/dist/css/movie_list_top10.css">
    <link rel="stylesheet" href="../static/plugins/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="../static/dist/css/mynav.css">
</head>
<body>
<div class="container-fluid " >
    <div class="row">
        <nav class="navbar navbar-expand-md fixed-top" role="navigation">
            <div class="container container-lk">
                <div class="navbar-header">
                    <a class="navbar-brand" href="home.html"><img src="../static/dist/img/logo2.jpg" alt=""></a>
                    <button class="navbar-btn dropdown-toggle" onclick="pop()">
                        <i style="font-size:24px;color: white" class="fa">
                            &#xf0c9
                        </i>
                        <p>菜单</p>
                    </button>
                </div>
                <div id="sid" class="sidebar">
                    <button onclick="remove()"><img src="../static/dist/img/delete.png" alt=""></button>
                </div>


                <div class="input-group navbar-left">
                    <!--                    <span class="input-group-addon dropdown">-->
                    <!--                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">-->
                    <!--                                所有 <b class="caret"></b>-->
                    <!--                            </a>-->
                    <!--                            <ul class="dropdown-menu">-->
                    <!--                                <li><a href="#">所有</a></li>-->
                    <!--                                <li><a href="#">类型</a></li>-->
                    <!--                                <li class="divider"></li>-->
                    <!--                                <li><a href="#">设置</a></li>-->
                    <!--                                <li class="divider"></li>-->
                    <!--                                <li><a href="#">退出登录</a></li>-->
                    <!--                            </ul>-->
                    <!--                    </span>-->
                    <input type="text" class="form-control" placeholder="请输入要搜索的内容" aria-label="Amount (to the nearest dollar)">
                    <span class="input-group-addon btn btn-primary"><i class="fa fa-search"></i></span>
                </div>
                <div class="collapse navbar-collapse" id="example-navbar-collapse">
                    <ul class="nav navbar-nav navbar-right " onmouseout="leave()">
                        <li><a href="home.html">首页</a></li>
                        <li><a href="#">电影</a></li>
                        <li><a href="#">榜单</a></li>
                        <li><a href="login.html" >登录|注册</a></li>

                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                我的 <b class="caret"></b>
                            </a>
                            <ul class="dropdown-menu" style="background-color: #080E1C">
                                <li><a href="personal.html">个人中心</a></li>
                                <li><a href="personal_order.html">我的订单</a></li>
                                <li class="divider"></li>
                                <li><a href="personal_settings.html">设置</a></li>
                                <li class="divider"></li>
                                <li><a href="#">退出登录</a></li>
                            </ul>
                        </li>
                        <li>
                            <img class="picture" src="../static/dist/img/30.jpg">
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
    </div>
</div>




<div class="head2">
    <div class="container-cc">
        <ul>
            <li class="turn1">热映口碑榜</li>
            <li class="turn2">最受期待榜</li>
            <li class="turn3">国内票房榜</li>
            <li class="turn4">北美票房榜</li>
            <li class="turn5">TOP10榜</li>
        </ul>
    </div>
</div>
<div class="center">
    <div class="centerHead">
            <span class="centerHead1">2020-09-16</span>
            <span class="head1">已更新</span>
            <div class="centerHead2">榜单规则：将猫眼电影库中的经典影片，按照评分和评分人数从高到低综合排序取前10名，每天上午10点更新。相关数据来源于“第二视界电影库”。</div>
    </div>

    <div class="centerContent">
        <ul>
            <li>
                <ul class="inner">
                    <li>
                        <img src="../static/dist/img/no1.png" alt="" class="no1">
                    </li>
                    <li>
                        <img src="../static/dist/img/film.jpg" alt="" class="film1">
                    </li>
                    <li>
                        <div class="filmContent">
                            <span class="name">射雕英雄传之东成西就</span><br>
                            <span class="actor">主演：张国荣,梁朝伟,张学友</span><br>
                            <span class="time">上映时间：1993-02-05(中国香港)</span>
                        </div>
                    </li>
                    <li>
                        <div class="score">
                            <i class="integer">8.</i>
                            <i class="fraction">8</i>
                        </div>
                    </li>
                </ul>
            </li>
            <hr style="background-color: #ccc;height: 1px;border:none;width: 600px;margin-left: 380px;">
            <li>
                <ul class="inner">
                    <li>
                        <img src="../static/dist/img/no2.png" alt="" class="no1">
                    </li>
                    <li>
                        <img src="../static/dist/img/film.jpg" alt="" class="film1">
                    </li>
                    <li>
                        <div class="filmContent">
                            <span class="name">十二怒汉</span><br>
                            <span class="actor">主演：亨利·方达,李·科布,马丁·鲍尔萨姆</span><br>
                            <span class="time">上映时间：1957-04-13(美国)</span>
                        </div>
                    </li>
                    <li>
                        <div class="score">
                            <i class="integer">9.</i>
                            <i class="fraction">1</i>
                        </div>
                    </li>
                </ul>
            </li>
            <hr style="background-color: #ccc;height: 1px;border:none;width: 600px;margin-left: 380px;">
            <li>
                <ul class="inner">
                    <li>
                        <img src="../static/dist/img/no3.png" alt="" class="no1">
                    </li>
                    <li>
                        <img src="../static/dist/img/film.jpg" alt="" class="film1">
                    </li>
                    <li>
                        <div class="filmContent">
                            <span class="name">剪刀手爱德华</span><br>
                            <span class="actor">主演：约翰尼·德普,薇诺娜·瑞德,黛安娜·威斯特</span><br>
                            <span class="time">上映时间：1990-12-06(美国)</span>
                        </div>
                    </li>
                    <li>
                        <div class="score">
                            <i class="integer">8.</i>
                            <i class="fraction">8</i>
                        </div>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</div>

<script src="../static/plugins/jquery/jquery-3.4.1.js"></script>
<script src="../static/dist/js/movie_list.js"></script>
<script src="../static/plugins/bootstrap/js/bootstrap.js"></script>
<script src="../static/dist/js/mynav.js"></script>

</body>
</html>